<template>
	<div class="captcha-wrapper">
        <div class="l-captcha" data-site-key="47b4a059565cc060b666d5e2dbe1f914" data-callback="getResponse"></div>
	</div>
</template>	

<script>
import util from '@/libs/util'
export default {
  props: {
    reset: Boolean
  },
  data () {
    return {
      times: 0
    }
  },
  created () {
    util.log('=======createLuosimao=======')
    window.getResponse = this.resCallback
    this.createLuosimao()
  },
  destroyed () {
    if (window.LUOCAPTCHA) {
      // 组件销毁的时候 移除window.resize事件
      window.removeEventListener('resize', window.LUOCAPTCHA.reLocation)
    }
  },
  methods: {
    resCallback (resp) {
      // util.log('=========图形点击正确===========', this.times);
      // 这里有个bug ，getResponse会执行多次
      // 用 times 记录，只派发一次事件

      if (this.times === 0) {
        util.log('========= 图形验证成功 on-success 事件===========')
        this.$emit('on-success', resp)
      }
      this.times++
    }
  },
  watch: {
    reset () {
      // 监听 reset 的变化 重置验证码组件
      window.LUOCAPTCHA && window.LUOCAPTCHA.reset()
      this.times = 0
    }
  }
}
</script>

